<%--
  Created by IntelliJ IDEA.
  User: 周文涛
  Date: 2020/7/24
  Time: 17:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>影院票务管理系统</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/back/layuiadmin/layui/css/layui.css" media="all">
</head>
<body>
<div class="layui-collapse" lay-accordion>
    <div class="layui-colla-item">
        <h2 class="layui-colla-title">电影名称：<span id="filmName"></span></h2>
    </div>
    <div class="layui-colla-item">
        <h2 class="layui-colla-title">场次：<span id="screening"></span></h2>
    </div>
    <div class="layui-colla-item">
        <h2 class="layui-colla-title">会员折扣：<span id="vipType"></span></h2>
    </div>
</div>
<table class="layui-table" id="seat_table"></table>
<button class="layui-btn layui-btn-warm layui-btn-lg" id="shopCart"><i class="layui-icon layui-icon-cart"></i><span>0.0</span>￥</button>
<button class="layui-btn layui-btn-warm layui-btn-lg" id="submit">确认购买</button>

</body>
<script src="${pageContext.request.contextPath}/back/layuiadmin/layui/layui.js"></script>
<script type="text/javascript">
    layui.config({
        base: '${pageContext.request.contextPath}/back/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['table'], function(){
        var $ = layui.$;

        // 获取场次
        var screeningId = "${param.screeningId}";
        // 根据场次获取信息
        // 获取时间
        var screeningTime = "";
        var filmPrice = "";
        // 获取电影名称
        var filmName = "";

        $.ajax({
            url:"${pageContext.request.contextPath}/front/screening/"+screeningId
            ,success:function(result){
                screeningTime = result.screeningStartTime;
                $("#screening").text(screeningTime);
                filmPrice = result.screeningPrice;
                filmName = result.film.filmName;
                $("#filmName").text(filmName);
            }
            ,error:function(){

            }
        });
        // 获取用户编号
        var accountId = "${sessionScope.account.accountId}";
        // 获取用户折扣
        var vipType;
        $.ajax({
            url:"${pageContext.request.contextPath}/front/userVipType",
            data:{
                accountId:accountId
            },
            success:function(result){
                vipType = result;
                $("#vipType").text(vipType);
            }
        });

        // 支付方式
        var payType = "支付宝";


        $.ajax({
            url:"${pageContext.request.contextPath}/front/seat"
            ,data:{
                screeningId:screeningId
            }
            ,success:function(result,status,xhr){
                var html = "<tr><td class='layui-btn layui-btn-danger' style='width:621px'>主屏幕</td><tr>";
                $.each(result,function(index,val){
                    html += "<tr>";
                    $.each(val,function(i,v){
                        if(v == 0){
                            html+= "<td data-line='"+index+"' data-column='"+i+"' class='layui-btn layui-btn-primary'><i class='layui-icon layui-icon-username'></i></td>";
                        }else{
                            html+= "<td  data-line='"+index+"' data-column='"+i+"' class='layui-btn layui-btn-danger'><i class='layui-icon layui-icon-username'></i></td>";
                        }

                    });
                    html += "</tr>";
                });
                $("#seat_table").html(html);
            }
            ,error:function(xhr,status,error){
                console.log("ajax错误");
            }
        });

        // 鼠标移入
        $(document).on("mouseover","td",function(){
            if($(this).hasClass("layui-btn-primary")){
                $(this).removeClass("layui-btn-primary").addClass("layui-btn-normal");
            }

        });
        $(document).on("mouseout","td",function(){
            if($(this).hasClass("layui-btn-normal")){
                $(this).removeClass("layui-btn-normal").addClass("layui-btn-primary");
            }
        });
        $(document).on("click","td",function(){
            if($(this).hasClass("layui-btn-normal")){
                $(this).removeClass("layui-btn-normal").addClass("selected");
                let shopCart = parseFloat($("#shopCart span").text());
                $("#shopCart span").text(shopCart+parseFloat(filmPrice)*parseFloat(vipType));
            }else if($(this).hasClass("selected")){
                $(this).removeClass("selected").addClass("layui-btn-normal");
                let shopCart = parseFloat($("#shopCart span").text());
                $("#shopCart span").text(shopCart-parseFloat(filmPrice)*parseFloat(vipType));
            }
        });
        $("#submit").click(function(){
         if(accountId != ""){

                // 获取座位
                var seatArray = [];
                if($(".selected").length == 0){
                    layer.msg("请选择座位");
                }else{
                    $(".selected").each(function(){
                        let line = $(this).data("line");
                        let column = $(this).data("column");
                        let total = ""+line+column;
                        seatArray.push(total);
                    });

                    let shopCart = parseFloat($("#shopCart span").text());
                    // 创建订单
                    $.ajax({
                        type:"post"
                        ,url:"${pageContext.request.contextPath}/front/orders"
                        ,data:{
                            screeningId:screeningId,
                            accountId:accountId,
                            payPrice:shopCart,
                            payType:payType,
                            seatArray:seatArray.join(',')
                        }
                        ,success:function(result,status,xhr){
                            if(result){
                                layer.confirm("创建成功",function(){
                                    parent.location.href="${pageContext.request.contextPath}/front/userOrders.jsp";
                                },function () {
                                    parent.location.href="${pageContext.request.contextPath}/front/userOrders.jsp";
                                });

                            }else{
                                layer.confirm("座位已有人，请重新选择",function(){
                                    location.reload();
                                },function () {
                                    location.reload();
                                });

                            }
                        }
                        ,error:function(){
                            layer.msg("ajax请求失败");
                        }
                    });
                }



            }else{
                layer.msg("未登录账号，请登录");
            }
        });

    });

</script>
</html>
